<template>
  <div class="app-container" v-if="show">
    <el-form
      class="ry_form"
      v-show="showSearch"
      :inline="true"
      label-width="100px"
      :model="queryParams"
      ref="queryForm"
      size="medium"
    >
      <el-form-item :label="$t('order.status')" prop="status">
        <DictRadio
          v-model="queryParams.status"
          :radioData="statusList"
          :showAll="'all'"
          size="small"
          @change="handleQuery"
        ></DictRadio>
      </el-form-item>
      <el-form-item :label="$t('order.orderNo')" prop="orderSn">
        <el-input
          v-model.trim="queryParams.orderSn"
          clearable="clearable"
          :placeholder="$t('order.orderNoPlaceholder')"
          size="small"
          @keyup.enter.native="handleQuery"
        ></el-input>
      </el-form-item>
      <el-form-item :label="$t('order.YTNo')" prop="orderNo">
        <el-input
          v-model.trim="queryParams.orderNo"
          clearable="clearable"
          :placeholder="$t('order.orderNoPlaceholder')"
          size="small"
          @keyup.enter.native="handleQuery"
        ></el-input>
      </el-form-item>
      <el-form-item :label="$t('order.asn')" prop="asn">
        <el-input
          v-model.trim="queryParams.asn"
          clearable="clearable"
          :placeholder="$t('order.orderNoPlaceholder')"
          size="small"
          @keyup.enter.native="handleQuery"
        ></el-input>
      </el-form-item>
      <el-form-item :label="$t('order.OutboundMethod')" prop="fromType">
        <el-select v-model="queryParams.fromType">
          <el-option v-for="item in fromTypeList" :key="item.id" :label="item.label" :value="item.value">
          </el-option>
        </el-select>
      </el-form-item>
      <el-form-item class="flex_one tr">
        <el-button
          icon="el-icon-search"
          size="mini"
          type="primary"
          @click="handleQuery"
          >{{ $t("common.search") }}</el-button
        >
        <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">{{
          $t("common.reset")
        }}</el-button>
      </el-form-item>
    </el-form>
    <el-row class="mb8" :gutter="10">
      <el-col :span="1.5">
        <el-button
          icon="el-icon-plus"
          plain="plain"
          size="mini"
          type="primary"
          @click="DELI_visible = true"
          >{{ $t("order.deliveryImport") }}</el-button
        >
        <el-button
          icon="el-icon-plus"
          plain="plain"
          size="mini"
          type="primary"
          @click="handleImport()"
          >{{ $t("order.SKUImport") }}</el-button
        >
        <el-button
          icon="el-icon-plus"
          plain="plain"
          size="mini"
          type="primary"
          @click="YT_handleImport()"
          >{{ $t("order.YMXImport") }}</el-button
        >
        <el-button
          icon="el-icon-plus"
          plain="plain"
          size="mini"
          type="primary"
          @click="NOON_handleImport()"
          >{{ $t("order.NOONImport") }}</el-button
        >
        <!-- <template v-if="queryParams.status === null">
          <el-button
            plain="plain"
            size="mini"
            type="primary"
            @click="changeStatusModal = true"
            >更改状态</el-button
          >
        </template> -->
        <template v-if="[0].includes(queryParams.status)">
          <!-- <el-button
            plain="plain"
            size="mini"
            type="primary"
            @click="cancelOrder()"
            >取消订单</el-button
          > -->
          <!-- <el-button
            plain="plain"
            size="mini"
            type="primary"
            @click="changeStatusModal = true"
            >配货</el-button
          > -->
        </template>
        <template v-if="[1].includes(queryParams.status)">
          <!-- <el-button
            plain="plain"
            size="mini"
            type="primary"
            @click="deliverGoods()"
            >发货</el-button
          >
          <el-button
            plain="plain"
            size="mini"
            type="primary"
            @click="uploadExcel()"
            >上传发货清单</el-button
          > -->
        </template>
        <template v-if="[2].includes(queryParams.status)">
          <!-- <el-button
            plain="plain"
            size="mini"
            type="primary"
            @click="receiveShop()"
            >收货</el-button
          > -->
        </template>
        <template v-if="[4].includes(queryParams.status)">
          <!-- <el-button
            v
            plain="plain"
            size="mini"
            type="danger"
            @click="deleteOrder()"
            >删除订单</el-button
          > -->
        </template>
      </el-col>
      <right-toolbar
        :columns="columns"
        :showSearch.sync="showSearch"
        @queryTable="getList"
      ></right-toolbar>
    </el-row>
    <WmsTable
      v-loading="loading"
      :data="wmsReceiptOrderList"
      @selection-change="handleSelectionChange"
    >
      <el-table-column
        align="center"
        type="selection"
        width="55"
      ></el-table-column>
      <el-table-column
        v-if="columns[0].visible"
        align="center"
        :label="$t('order.No')"
        width="100"
        prop="orderSn"
      ></el-table-column>
      <el-table-column
        v-if="columns[3].visible"
        align="center"
        :label="$t('order.YTNo')"
        width="110"
        prop="orderNo"
      ></el-table-column>
      <el-table-column
        v-if="columns[3].visible"
        align="center"
        :label="$t('order.ASN')"
        width="110"
        prop="asn"
      ></el-table-column>
      <el-table-column
        align="center"
        :label="$t('common.customer')"
        prop="customerName"
      ></el-table-column>
      <el-table-column
        align="center"
        :label="$t('order.customerCode')"
        prop="customerCode"
      ></el-table-column>
      <el-table-column
        v-if="columns[4].visible"
        align="center"
        :label="$t('order.status')"
        width="140"
      >
        <template slot-scope="scope">
          <el-tag effect="plain" size="" :type="getstatusTag(scope.row)"
            >{{ getstatus(scope.row) }}
          </el-tag>
        </template>
      </el-table-column>
      <el-table-column
        v-if="columns[5].visible"
        align="center"
        :label="$t('order.money')"
        prop="totalAmount"
      ></el-table-column>
      <el-table-column
        align="center"
        :label="$t('order.boxCount')"
        prop="boxCount"
      ></el-table-column>
      <el-table-column
        align="center"
        :label="$t('order.receiverDetailAddress')"
        prop="receiverDetailAddress"
        width="200"
      ></el-table-column>
      <el-table-column
        align="center"
        :label="$t('order.OutboundMethod')"
        prop="outBoundType"
      ></el-table-column>
      <el-table-column
        align="center"
        :label="$t('order.expectedDeliveryTime')"
        width="110"
        prop="planOutTime"
      ></el-table-column>
      <el-table-column
        align="center"
        :label="$t('common.createTime')"
        width="110"
        prop="createTime"
      ></el-table-column>
      <el-table-column
        align="center"
        width="220"
        class-name="small-padding fixed-width"
        :label="$t('common.operation')"
        fixed="right"
      >
        <template v-slot="{ row }">
          <!-- 订单打印 -->
          <el-button
            icon="el-icon-print"
            size="mini"
            type="text"
            @click.stop="printOut(row, true)"
            >{{ $t("order.name") + $t("common.printing") }}</el-button
          >
          <!-- 指令打印 -->
          <el-button
            icon="el-icon-print"
            size="mini"
            type="text"
            @click.stop="printOutIns(row, true)"
            >{{ $t("order.inst") + $t("common.printing") }}</el-button
          >
          <el-button v-if="row.status === 0" size="mini" type="text" @click.stop="handleAbandon(row)">{{
            $t("common.abandon")
          }}</el-button>
          <el-button size="mini" type="text" @click.stop="jumpDetail(row)">{{
            $t("common.toDetail")
          }}</el-button>
        </template>
      </el-table-column>
    </WmsTable>
    <pagination
      v-show="total > 0"
      :limit.sync="queryParams.pageSize"
      :page.sync="queryParams.pageNum"
      :total="total"
      @pagination="getList"
    ></pagination>
    <el-dialog
      :visible.sync="modalObj.show"
      :title="modalObj.title"
      :width="modalObj.width"
    >
      <template v-if="modalObj.component === 'print-type'">
        <el-radio-group v-model="modalObj.form.value">
          <el-radio :label="1">{{ $t("common.lodopPrint") }}</el-radio>
          <el-radio :label="2">{{ $t("common.browserPrint") }}</el-radio>
        </el-radio-group>
      </template>
      <template
        v-if="
          modalObj.form.value === 2 ||
          modalObj.component === 'window-print-preview'
        "
      >
        <Order-print :row="modalObj.form.row" ref="orderPrintRef"></Order-print>
      </template>
      <template slot="footer" class="dialog-footer">
        <el-button @click="modalObj.cancel">{{
          $t("common.cancel")
        }}</el-button>
        <el-button @click="modalObj.ok" type="primary">{{
          $t("common.confirm")
        }}</el-button>
      </template>
    </el-dialog>
    <!-- 导入 -->
    <ImportFile
      ref="ImportFileRef"
      :title="$t('order.import')"
      :actionUrl="'/wms/omsOrderShop/importExcel'"
      :router-path="'/order/index'"
      :tempalteUrl="templateUrl"
      :params="params"
      @finish="getList"
    />
    <!-- 易特导入 -->
    <ImportFile
      ref="YT_ImportFileRef"
      :title="$t('order.import')"
      :actionUrl="'/wms/omsOrderShop/importExcelBox'"
      :router-path="'/order/index'"
      :tempalteUrl="YT_templateUrl"
      :params="params"
      @finish="getList"
    />
    <!-- noon订单导入 -->
    <ImportFile
      ref="NOON_ImportFileRef"
      :title="$t('order.import')"
      :actionUrl="'/wms/omsOrderShop/importNoonExcel'"
      :router-path="'/order/index'"
      :tempalteUrl="NOON_templateUrl"
      :params="params"
      @finish="getList"
    />
    <!-- 更改状态 -->
    <el-dialog
      :title="$t('common.changeStatus')"
      :visible.sync="changeStatusModal"
      width="300px"
      :show-close="false"
    >
      <p>{{ $t('order.batchOrderStatusUpdate') }}</p>
      <el-select v-model="changeStatusValue" :placeholder="$t('common.placeholderSelect')">
        <el-option
          v-for="item in statusList"
          :key="item.value"
          :label="item.label"
          :value="item.value"
        ></el-option>
      </el-select>
      <span slot="footer" class="dialog-footer">
        <el-button @click="changeStatusModal = false">{{
          $t("common.cancel")
        }}</el-button>
        <el-button type="primary" @click="handleChangeOk">{{
          $t("common.confirm")
        }}</el-button>
      </span>
    </el-dialog>
    <!-- SKU导入 -->
    <el-dialog :title="$t('common.import')" :visible.sync="SKU_visible" width="40%">
      <el-form ref="form" :model="beforeForm" label-width="120px" label-position="left">
        <el-form-item :label="$t('outBound.Expected delivery time')">
          <el-date-picker v-model="beforeForm.planOutTime" 
          value-format="yyyy-MM-ddTHH:mm:ss"
          type="datetime" :placeholder="$t('common.placeholderSelect')" :picker-options="pickerOptions" default-time="12:00:00" style="width: 100%" />
        </el-form-item>
      </el-form>
      <span slot="footer" class="dialog-footer">
        <el-button @click="SKU_visible = false">{{
          $t("common.cancel")
        }}</el-button>
        <el-button type="primary" @click="$refs.ImportFileRef.open()">{{
          $t("common.confirm")
        }}</el-button>
      </span>
    </el-dialog>
    <!-- YT导入 -->
    <el-dialog :title="$t('common.selectCustomer')" :visible.sync="YT_visible" width="40%">
      <el-form ref="form" :model="beforeForm" label-width="120px" label-position="left">
        <el-form-item v-if="YT_roles" label="客户名称">
          <WmsCustomerSelect v-model="beforeForm.customerId"></WmsCustomerSelect>
        </el-form-item>
        <el-form-item :label="$t('outBound.Expected delivery time')">
          <el-date-picker v-model="beforeForm.planOutTime" 
          value-format="yyyy-MM-ddTHH:mm:ss"
          type="datetime" :placeholder="$t('common.placeholderSelect')" :picker-options="pickerOptions" default-time="12:00:00" style="width: 100%" />
        </el-form-item>
      </el-form>
      <span slot="footer" class="dialog-footer">
        <el-button @click="YT_visible = false">{{
          $t("common.cancel")
        }}</el-button>
        <el-button type="primary" @click="$refs.YT_ImportFileRef.open()">{{
          $t("common.confirm")
        }}</el-button>
      </span>
    </el-dialog>
    <!-- NOON导入 -->
    <el-dialog :title="$t('common.selectCustomer')" :visible.sync="NOON_visible" width="40%">
      <el-form ref="form" :model="beforeForm" label-width="120px" label-position="left">
        <el-form-item v-if="YT_roles" label="客户名称">
          <WmsCustomerSelect v-model="beforeForm.customerId"></WmsCustomerSelect>
        </el-form-item>
        <el-form-item :label="$t('outBound.Expected delivery time')">
          <el-date-picker v-model="beforeForm.planOutTime"
          value-format="yyyy-MM-ddTHH:mm:ss"
          type="datetime" :placeholder="$t('common.placeholderSelect')" :picker-options="pickerOptions" default-time="12:00:00" style="width: 100%" />
        </el-form-item>
      </el-form>
      <span slot="footer" class="dialog-footer">
        <el-button @click="NOON_visible = false">{{
          $t("common.cancel")
        }}</el-button>
        <el-button type="primary" @click="$refs.NOON_ImportFileRef.open()">{{
          $t("common.confirm")
        }}</el-button>
      </span>
    </el-dialog>
    <!-- 派送订单导入前 -->
    <el-dialog :title="$t('order.deliOrImport')" :visible.sync="DELI_visible" width="60%">
      <el-form
        ref="ruleForm"
        :model="ruleForm"
        label-width="110px"
        label-position="left"
        label-suffix=":"
      >
        <el-row :gutter="20">
          <el-col v-for="(item, index) in deliveryColumns" :key="index">
            <FormComponents :item-obj="item" :form="ruleForm" :isedit="true">
              <template slot="tenantId">
                <WmsCustomerSelect
                  v-model="ruleForm.tenantId" style="width: 100%;"
                ></WmsCustomerSelect>
              </template>
              <template slot="YTNo">
                <el-select v-model="ruleForm.orderNo" filterable :placeholder="$t('common.placeholderSelect')" @focus="handleFocus" @change="handleYTNoChange" clearable>
                  <el-option v-for="item in orderNOptions" :key="item.id" :label="item.orderNo" :value="item.orderNo"></el-option>
                </el-select>
              </template>
              <template slot="planOutTime">
                <el-date-picker v-model="ruleForm.planOutTime"
                  value-format="yyyy-MM-ddTHH:mm:ss"
                  type="datetime" :placeholder="$t('common.placeholderSelect')" :picker-options="pickerOptions" default-time="12:00:00" style="width: 100%" />
              </template>
              <template slot="boxList">
                <BoxListComponent
                  ref="boxList"
                  :url="'/wms/omsPurchaseBox/list'"
                  :methodType="'post'"
                  :return-data="returnBoxData"
                  :params="{ ...queryBoxParams }"
                  :pageReq="{ page: 0, size: 10000 }"
                  :checkbox="checkbox"
                  :isBoxList="true"
                  @selection-change="handleSelectionBoxChange"
                />
              </template>
            </FormComponents>
          </el-col>
        </el-row>
      </el-form>
      <span slot="footer" class="dialog-footer">
        <el-button @click="DELI_visible = false">{{
          $t("common.cancel")
        }}</el-button>
        <el-button type="primary" @click="DELV_handleImport('ruleForm')">{{
          $t("common.confirm")
        }}</el-button>
      </span>
    </el-dialog>
    <Order-print :row="modalObj.form.row ? modalObj.form.row : ''" ref="orderPrintRef"></Order-print>
    <inst-print :row="InstructionsList ? InstructionsList : ''" ref="insPrintRef"></inst-print>
  </div>
</template>

<script>
import dayjs from "dayjs";
import Mix from "./mix.js";
import { getToken } from "@/utils/auth";
import {
  getOrderList,
  getDetailData,
  orderProduct,
  getInstruct,
  insertDispatchOrder,
  selectOrderList,
  invalidOrder
} from "@/api/order/index.js";
import { mapGetters } from "vuex";
import { ORDER_TEMPLATE } from "@/utils/printData";
import OrderPrint from "@/views/order/orderPrint";

import ImportFile from "@/components/Upload/ImportFile.vue";
import FormComponents from "@/components/Table/components/form.vue";
import InstPrint from "./orderDetail/instPrint";
import BoxListComponent from "@/views/components/wms/BoxList/index.vue";

export default {
  name: "Order",
  mixins: [Mix],
  components: { OrderPrint, ImportFile, FormComponents, InstPrint, BoxListComponent },
  props: {
    // 箱子默认左侧选择框
    checkbox: {
      type: Boolean,
      default: true,
    },
  },
  computed: {
    ...mapGetters([
      "supplierMap",
      "warehouseMap",
      "areaMap",
      "rackMap",
      "userId",
    ])
  },
  data() {
    return {
      show: false,
      modalObj: {
        title: this.$t("common.printMethod"),
        width: "520px",
        component: null,
        form: {
          value: null,
          row: null,
        },
        ok: () => {},
        cancel: () => {},
      },
      // 遮罩层
      loading: true,
      // 导出遮罩层
      exportLoading: false,
      // 选中数组
      ids: [],
      // 非单个禁用
      single: true,
      // 非多个禁用
      multiple: true,
      // 显示搜索条件
      showSearch: true,
      // 总条数
      total: 0,
      // 订单单表格数据
      wmsReceiptOrderList: [],
      YT_templateUrl:
        "https://fire-1317879807.cos.ap-shanghai.myqcloud.com/dfba00d1842d47e29a97b0141d31643e.xlsx",
      templateUrl:
        "https://zjyg-yt.oss-cn-hangzhou.aliyuncs.com/scm/upload/20230908/xls/14324e3e85f54fbeb104e73031099f03/new订单导入模板.xls",
      NOON_templateUrl:
        "https://fire-1317879807.cos.ap-shanghai.myqcloud.com/ab294dda66174acf9e9c3e68ed2165ff.xlsx",
      // 查询参数
      queryParams: {
        pageNum: 1,
        pageSize: 10,
        orderNo: null,
        status: null,
        orderSn: null,
        asn: null,
        fromType: null
      },
      // 查询参数
      queryBoxParams: {
        orderNo: null,
        pageSize: 10,
      },
      columns: [
        { key: 1, label: this.$t('order.No'), visible: true },
        { key: 2, label: this.$t('order.type'), visible: true },
        { key: 3, label: this.$t('common.customer'), visible: true },
        { key: 4, label: this.$t('order.orderNo'), visible: true },
        { key: 5, label: this.$t('order.status'), visible: true },
        { key: 6, label: this.$t('order.money'), visible: true },
      ],
      statusList: [
        { label: this.$t("order.statusList.first"), value: 0 },
        { label: this.$t("order.statusList.second"), value: 1 },
        { label: this.$t("order.statusList.third"), value: 2 },
        { label: this.$t("order.statusList.forth"), value: 3 },
        { label: this.$t("order.statusList.fifth"), value: 4 },
      ],
      changeStatusModal: false,
      changeStatusValue: null,
      deliveryTime: null,
      fileList: [],
      headers: {
        Authorization: getToken(),
      },
      YT_visible: false,
      NOON_visible: false,
      SKU_visible: false,
      customerId: null,
      DELI_visible: false,
      ruleForm: {},
      InstructionsList: [],
      orderNOptions: [],
      // 出入库方式 sku/箱子
      fromTypeList: [
        { label: "SKU", value: 1 },
        { label: this.$t('common.box'), value: 2 },
      ],
      beforeForm: {
        planOutTime: null,
        customerId: null
      },
      pickerOptions: {
        selectableRange: "10:00:00 - 17:00:00",
        disabledDate: (time) => {
          // 周五不可选
          if (time.getDay() === 5) {
            return true;
          }
          // 10:00-17:00可选
          if (time.getHours() >= 10 && time.getHours() <= 17) {
            return true;
          }
          // 其他时间不可选
          return false;
        },
      },
    };
  },
  async created() {
    // const res = await isStarRepo(
    //   "zccbbg",
    //   "wms-ruoyi",
    //   this.userId,
    //   "http://wms.ichengle.top/wms/receiptOrder",
    //   "Wms-Ruoyi-仓库库存管理",
    //   "https://gitee.com/zccbbg/wms-ruoyi"
    // );
    this.show = true;
    if (this.show) {
      this.getList()
    }
  },
  computed: {
    YT_roles() {
      // 暂时判断roles为common不是客户的未YT
      if(this.$store.state.user.roles[0] !== 'common') {
        return true
      }
    },
    params() {
      if (this.beforeForm || this.beforeForm.customerId || this.customerId) {
        return {
          customerId: this.beforeForm.customerId || this.customerId,
          planOutTime: this.beforeForm.planOutTime
        };
      } else {
        return {};
      }
    },
    deliveryColumns() {
      const base = [
        // { prop: "orderNo", label: this.$t('order.YTNo'), type: "input", col: 8 },
        { prop: "YTNo", slot: 'YTNo', label: this.$t('order.YTNo'), type: "input", col: 8 },
        { prop: "asn", label: this.$t('order.asdNo'), type: "input", col: 8 },
        { prop: "receiverName", label: this.$t('order.consigneeName'), type: "input", col: 8 },
        { prop: "receiverPhone", label: this.$t('order.consigneePhone'), type: "input", col: 8 },
        { prop: "receiverEmail", label: this.$t('order.consigneeEmail'), type: "input", col: 8 },
        {
          prop: "receiverDetailAddress",
          label: this.$t('order.consigneeAddress'),
          type: "input",
          col: 8,
        },
        {
          prop: "outBoundType",
          label: this.$t('order.outboundType'),
          type: "select",
          selectOptions: [
            { value: "FBN", label: "FBN" },
            { value: "FBA", label: "FBA" },
            { value: "私人派送", label: this.$t('order.private') },
            { value: "转送flex", label: this.$t('order.transferFlex') },
          ],
          col: 8,
        },
        {
          prop: "paymentMethod",
          label: this.$t('order.paymentMethod'),
          type: "select",
          selectOptions: [
            { value: "DOMESTIC", label: this.$t('order.internaloan') },
            { value: "OVERSEAS", label: this.$t('order.overseasCollection') },
          ],
          col: 8,
        },
        { prop: "planOutTime", slot: 'planOutTime', label: this.$t('order.expectedDeliveryTime'), type: "datetime", col: 8 },
        { prop: "boxList", slot: "boxList", label: this.$t('common.box'), type: "input", col: 24 },
      ];
      const customerRoles = [
        {
          slot: "tenantId",
          prop: "tenantId",
          label: this.$t('common.customer'),
          type: "input",
          col: 8,
        },
      ]
      if (this.YT_roles) {
        return [...customerRoles, ...base]
      } else {
        return [...base]
      }
    },
  },
  methods: {
    getstatusTag(row) {
      switch (row.status) {
        case 0:
          return "";
        case 1:
          return "warning";
        case 2:
          return "danger";
        case 3:
          return "success";
        case 4:
          return "success";
        case 9:
          return "info";
        // case 5:
        //   return "success";
      }
    },
    getstatus(row) {
      switch (row.status) {
        case 0:
          return this.$t("order.statusList.first");
        case 1:
          return this.$t("order.statusList.second");
        case 2:
          return this.$t("order.statusList.third");
        case 3:
          return this.$t("order.statusList.forth");
        case 4:
          return this.$t("order.statusList.fifth");
        // case 5:
        //   return "已收货";
        case 9:
          return this.$t("order.statusList.cancel");
      }
    },
    getSupplier(row, column) {},
    /** 查询订单单列表 */
    getList() {
      this.loading = true;
      const { pageNum, pageSize } = this.queryParams;
      const query = {
        ...this.queryParams,
        pageNum: undefined,
        pageSize: undefined,
      };
      const pageReq = { ...query, pageNum: pageNum, pageSize: pageSize };
      const pageReq1 = { page: pageNum - 1, size: pageSize };
      getOrderList(pageReq, pageReq1).then((response) => {
        const { content, totalElements } = response;
        content.map((x) => {
          x.createTime = x.createTime ? dayjs(x.createTime).format("YYYY-MM-DD HH:mm:ss") : '-'
          x.planOutTime = x.planOutTime ? dayjs(x.planOutTime).format("YYYY-MM-DD HH:mm:ss") : '-'
        });
        this.wmsReceiptOrderList = content;
        this.total = totalElements;
        this.loading = false;
        this.$nextTick(() => {
          this.$refs.YT_ImportFileRef.cancel();
          this.$refs.ImportFileRef.cancel();
          this.$refs.NOON_ImportFileRef.cancel();
        });
        this.NOON_visible = false;
        this.YT_visible = false;
      });
    },
    returnBoxData(data) {
      if (data.content) {
        return data.content;
      }
    },
    /** 搜索按钮操作 */
    handleQuery() {
      this.queryParams.pageNum = 1;
      this.getList();
    },
    /** 重置按钮操作 */
    resetQuery() {
      this.resetForm("queryForm");
      this.handleQuery();
    },
    // 多选框选中数据
    handleSelectionChange(selection) {
      this.ids = selection.map((item) => item.id);
      this.single = selection.length !== 1;
      this.multiple = !selection.length;
    },
    // 导入订单
    YT_handleImport() {
      this.YT_visible = true;
    },
    // NOON导入订单
    NOON_handleImport() {
      this.NOON_visible = true;
    },
    handleImport() {
      this.SKU_visible = true;
      // this.$refs.ImportFileRef.open();
    },
    // 派送订单导入
    DELV_handleImport(formName) {
      this.$refs[formName].validate((valid) => {
        if (valid) {
          insertDispatchOrder({ ...this.ruleForm }).then((res) => {
            if (res) {
              this.$message.success(this.$t('common.succcessInfo'));
              this.DELI_visible = false;
            }
          });
        } else {
          console.log("error submit!!");
          return false;
        }
      });
    },
    // 派送订单导入级联箱子
    handleYTNoChange(v) {
      if(v) {
        this.queryBoxParams.orderNo = v
        this.$nextTick(() => {
          this.$refs.boxList[0].getList();
        });
      }
    },
    handleSelectionBoxChange(v) {
      this.ruleForm.boxId = v.map(a=>{ return a.id })
      console.log('this.ruleForm.boxId', this.ruleForm.boxId)
    },
    printOut(row, print) {
      // this.modalObj = {
      //   show: true,
      //   title: this.$t('common.printMethod'),
      //   width: "520px",
      //   component: "print-type",
      //   form: {
      //     value: 1,
      //     row,
      //   },
      //   ok: () => {
      //     this.modalObj.show = false;
      //     if (this.modalObj.form.value === 1) {
      //       this.doPrintOut(row, false);
      //     } else {
      this.windowPrintOut(row, print);
      //     }
      //   },
      //   cancel: () => {
      //     this.modalObj.show = false;
      //   },
      // };
    },
    printOutIns(row, print) {
      this.windowPrintOutIns(row, print);
    },
    getTableData(id) {
      const query = {
        orderId: id,
        pageNum: 1,
        pageSize: 10000,
      };
      orderProduct(query)
        .then((res) => {
          this.tableData = res.content;
        })
        .finally(() => {});
    },
    windowPrintOut(row, print) {
      this.getTableData(row.id);
      getDetailData(row.id).then((res) => {
        if (print) {
          this.modalObj.form.row = {
            ...res,
            details: []
          };
          // console.log('this.modalObj.form.row.details', this.modalObj.form.row)
          this.modalObj.form.row.details = this.tableData;
          if (this.modalObj.form.row.details.length > 0) {
            this.$nextTick(() => {
              this.$refs["orderPrintRef"].start();
            });
          }
          return;
        }
        this.$nextTick(() => {
          this.modalObj = {
            show: true,
            title: "浏览器打印预览",
            width: "800px",
            component: "window-print-preview",
            form: {
              value: 1,
              row,
              print,
            },
            ok: () => {
              this.modalObj.show = false;
            },
            cancel: () => {
              this.modalObj.show = false;
            },
          };
        });
      });
    },
    windowPrintOutIns(row, print) {
      getInstruct({ orderId: row.id }).then((res) => {
        this.InstructionsList = res.content.map((r) => {
          return {
            // 单行编辑状态
            editRows: false,
            edit: true,
            ...r,
          };
        });
        // console.log('this.InstructionsList', this.InstructionsList)
        this.$nextTick(() => {
          this.$refs["insPrintRef"].start();
        });
      });
    },
    doPrintOut(row, print) {
      getDetailData(row.id).then((result) => {
        console.log("result", result);
        if (print) {
          this.$lodop.print(ORDER_TEMPLATE, [result]);
        } else {
          this.$lodop.preview(ORDER_TEMPLATE, [result]);
        }
      });
    },
    getOrderDetail(row) {
      //查询详情
      return getDetailData(row.id).then((response) => {
        const { details, items } = response;
        const map = {};
        (items || []).forEach((it) => {
          map[it.id] = it;
        });
        let detailList = [],
          totalCount = 0;
        details &&
          details.forEach((it) => {
            const prod = map[it.itemId];
            totalCount += it.planQuantity;
            detailList.push({
              itemName: prod.itemName,
              itemNo: prod.itemNo,
              itemType: prod.itemType,
              planQuantity: it.planQuantity,
              place,
            });
          });
        return {
          remark: row.remark,
          receiptOrderNo: row.receiptOrderNo,
          orderNo: row.orderNo,
          createTime: row.createTime,
          details: detailList,
          totalCount,
          createByName: row.createByName,
        };
      });
    },
    jumpDetail(row) {
      this.$router.push({
        path: "/order/orderDetail",
        query: {
          id: row.id,
        },
      });
    },
    handleFocus() {
      selectOrderList({ tenantId: this.ruleForm.tenantId }).then(res=>{
        this.orderNOptions = res
      })
    },
    handleAbandon(row) {
      this.$confirm(this.$t('common.confirmMsg') + ' ' + this.$t('fiance.writeOff') + '?', this.$t('common.reminder'), {
        confirmButtonText: this.$t('common.confirm'),
        cancelButtonText: this.$t('common.cancel'),
        type: 'warning'
      }).then(() => {
        const params = { id: row.id }
        invalidOrder({...params}).then(r=>{
          if(r) {
            this.$message({
              type: 'success',
              message: this.$t('common.succcessInfo')
            });
            this.getList();
          }
        })
      }).catch(() => {});
    }
  },
};
</script>
<style lang="stylus">
.showOverTooltip {
  display: -webkit-box;
  text-overflow: ellipsis;
  overflow: hidden;
  /* 这里是3行 */
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
}

.popperOptions[x-placement^=left] .popper__arrow::after {
  border-left-color: #565D6B;
}

.popperOptions[x-placement^=right] .popper__arrow::after {
  border-right-color: #565D6B;
}

.popperOptions[x-placement^=bottom] .popper__arrow::after {
  border-bottom-color: #565D6B;
}

.popperOptions[x-placement^=top] .popper__arrow::after {
  border-top-color: #565D6B;
}

.popperOptions {
  background-color: #565D6B;
  color: #FFFFFF;
  border: #565D6B;
}
</style>
